import { View, Text, Icon } from "@tarojs/components";
import Taro,{ useLoad } from "@tarojs/taro";
import "./index.scss";
import { useState } from "react";
import { request } from "@/utils/request";

export default function PaySuccess() {
  // const [orderId, setOrderId] = useState<string>('')
  const [orderDetail, setOrderDetail] = useState<any>({});

  function getOrderDetail(orderId) {
    request({
      url: '/api/payment/order/getPaymentOrderDetail',
      method: 'POST',
      data: {
        id:orderId
      },
      success: (data) => {
        console.log('getOrderDetail data:',data)
        data.statusName = getStatusName(data.status)
        data.pointPayMoney = data.pointPay / 100
        data.amountPayYuan = data.amountPay / 100
        setOrderDetail(data)
      }
    })
  }
  function getStatusName(status){
    if(status == 0 ){
      return '未缴费'
    }else if(status == 1){
      return '已缴费'
    }else if(status == 2){
      return '已完成'
    }else {
      return '已取消'
    }
  }
  useLoad((options) => {
    console.log("Page loaded. options：",options);
    if(options.id){
      getOrderDetail(options.id)
    }
  });

  return (
    <View className="payOrderDetail safe-bottom">
      <View className="bodyer">
        <View className="list">
          <View className="list-item">
            <View className="label">缴费状态</View>
            <View className="value">{orderDetail.statusName}</View>
          </View>
          <View className="list-item">
            <View className="label">缴费单号</View>
            <View className="value">{orderDetail.orderNo}</View>
          </View>
          <View className="list-item">
            <View className="label">下单时间</View>
            <View className="value">{orderDetail.createTime}</View>
          </View>
          <View className="list-item">
            <View className="label">参保人</View>
            <View className="value">{orderDetail.name}</View>
          </View>
          <View className="list-item">
            <View className="label">身份证号</View>
            <View className="value">{orderDetail.idCard}</View>
          </View>
          <View className="list-item">
            <View className="label">参保地区</View>
            <View className="value">{orderDetail.provincesName}{orderDetail.cityName}</View>
          </View>
          <View className="list-item">
            <View className="label">缴费年份</View>
            <View className="value">{orderDetail.year}年</View>
          </View>
          <View className="list-item">
            <View className="label">缴费金额</View>
            <View className="value">{orderDetail.paymentStandard}元</View>
          </View>
          <View className="list-item">
            <View className="label">积分使用</View>
            <View className="value">{orderDetail.pointPay}积分(抵扣{orderDetail.pointPayMoney}元)</View>
          </View>
          <View className="list-item">
            <View className="label">实付金额</View>
            <View className="value">{orderDetail.amountPayYuan}元</View>
          </View>
        </View>
      </View>
    </View>
  );
}
